
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

<!--  Version: Multiflex-3 Update-2 / Overview             -->
<!--  Date:    November 29, 2006                           -->
<!--  Author:  G. Wolfgang                                 -->
<!--  License: Fully open source without restrictions.     -->
<!--           Please keep footer credits with a link to   -->
<!--           G. Wolfgang (www.1-2-3-4.info). Thank you!  -->

<h:head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <meta http-equiv="cache-control" content="no-cache" />
  <meta http-equiv="expires" content="3600" />
  <meta name="revisit-after" content="2 days" />
  <meta name="robots" content="index,follow" />
  <meta name="publisher" content="Your publisher infos here ..." />
  <meta name="copyright" content="Propiedad de Nogsoft solutions" />
  <meta name="author" content="Diseno por Freddy Nogales/ Author: Your author infos here ..." />
  <meta name="distribution" content="global" />
  <meta name="description" content="sistema de compra-venta de selarom" />
  <meta name="keywords" content="Your keywords, keywords, keywords, here ..." />
  <link rel="stylesheet" type="text/css" media="screen,projection,print" href="./css/layout4_setup.css" />
  <link rel="stylesheet" type="text/css" media="screen,projection,print" href="./css/layout4_text.css" />
  <link rel="icon" type="image/x-icon" href="./img/favicon.ico" /> 
  <title>Inversiones Selaroma</title>
</h:head>

<!-- Global IE fix to avoid layout crash when single word size wider than column width -->
<!--[if IE]><style type="text/css"> body {word-wrap: break-word;}</style><![endif]-->

<h:body styleClass="body">
  <!-- Main Page Container -->
  <div class="page-container">

   <!-- For alternative headers START PASTE here -->

    <!-- A. HEADER -->
    <div class="header">

      <!-- A.1 HEADER TOP -->
      <div class="header-top">

        <!-- Sitelogo and sitename -->
        <a class="sitelogo" href="#" title="Go to Start page"></a>
        <div class="sitename">
          <h1><a href="index.html" title="Go to Start page">Selarom<span style="font-weight:normal;font-size:50%;">&nbsp;</span></a></h1>
          <h2>Venta de Repuestos Automotrices </h2>
        </div>

        <!-- Navigation Level 0 -->


        <!-- Navigation Level 1 -->

      </div>

      <!-- A.2 HEADER MIDDLE -->
      <div class="header-middle">

        <!-- Site message -->
        <div class="sitemessage">
          <h1 >SELAROMA C.A. </h1>
          <h2>R.I.F. J-00088710-1</h2>
		  <h2>Direccion: Final prolongación Av. Rómulo Gallegos Barrio La Alcabala</h2>
        </div>
      </div>

      <!-- A.3 HEADER BOTTOM -->
      <div class="header-bottom">

        <!-- Navigation Level 2 (Drop-down menus) -->
        <div class="nav2">

          <!-- Navigation item -->


          <!-- Navigation item -->
          <ul>

          <li><a href="#">Login</a>
            <!--<![endif]-->
            <!--[if lte IE 6]><table><tr><td><![endif]-->
            <ul>
              <li><a href="login.xhtml">Inicio de Login</a></li>
              <li><a href="index.html">Pagina Principal</a></li>

            </ul>
            <!--[if lte IE 6]></td></tr></table></a><![endif]-->
          </li>
          </ul>

          <!-- Navigation item -->
          <ul>

          <li><a href="#">Acerca de
            <!--[if IE 7]><!-->
            </a>
            <!--<![endif]-->
            <!--[if lte IE 6]><table><tr><td><![endif]-->
            <ul>
              <li><a href="#">Maestro Facturacion</a></li>
              <li><a href="#">Clientes</a></li>
            </ul>
            <!--[if lte IE 6]></td></tr></table></a><![endif]-->
          </li>
          </ul>
		   <ul>


          </ul>
        </div>
	  </div>

      <!-- A.4 HEADER BREADCRUMBS -->

      <!-- Breadcrumbs -->
      <div class="header-breadcrumbs">
        <ul>
          <li><a href="#">Login</a></li>
    
    
        </ul>

        <!-- Search form -->
        <div class="searchform">
          <form action="#" method="get" class="form">

          </form>
        </div>
      </div>
    </div>

    <!-- For alternative headers END PASTE here -->

    <!-- B. MAIN -->
    <div class="main">

      <!-- B.1 MAIN NAVIGATION -->
      <div class="main-navigation">


        <!-- Navigation Level 3 -->
        <div class="round-border-topright"></div>
		<h1 class="first">Login de Usuario </h1>

        <!-- Navigation with grid style -->
        <dl class="nav3-grid">
          <dt><a href="#">Login</a></dt>
      


        </dl>

        <!-- Template infos -->


      </div>

      <!-- B.2 MAIN CONTENT -->
       <div class="main-content">

        <!-- Pagetitle -->
        <h1 class="pagetitle">LOGIN DE  USUARIO </h1>

        <!-- Content unit - One column -->
        <div class="column1-unit">
         <!-- Content unit - One column -->
        <h1 class="block">Ventana de logueo de usuario </h1>
        <div class="column1-unit">
          <div class="contactform">

           <h:form id="loginForm" >
              <fieldset>
              <legend>&nbsp;Indique su Usuario y Clave para accesar al SISTEMA &nbsp;</legend>
              <div class="error-div-login" >
                <h:outputText value="#{loginController.error}"></h:outputText>
              </div>

              <h:panelGrid columns="2" columnClasses="etiquetaLogin,inputLogin">
                  <h:panelGroup>
                      
                      <h:outputLabel styleClass="left" >Usuario:</h:outputLabel>
                  </h:panelGroup>
                  
                  <h:panelGroup>
                      <h:inputText  id="usuario" value="#{loginController.usuario}"  tabindex="1" styleClass="field"  required="true"  requiredMessage="  Usuario no puede estar vacio" validatorMessage="El usuario debe tener al menos 5 caracteres"/>
                       <div class="error-div-login" >
                            <h:message for="usuario" styleClass="error"/>
                            <h:outputText styleClass="error" value="#{controladorCargo.error}"></h:outputText>
                       </div>                                        
                  </h:panelGroup>

                  <h:panelGroup>
                      <h:outputLabel styleClass="left">Clave de Acceso:</h:outputLabel>
                  </h:panelGroup>

                  <h:panelGroup>
                      <h:inputSecret id="clave" value="#{loginController.password}" tabindex="2" styleClass="field" required="true" requiredMessage="  Debe indicar el password del Usuario" validatorMessage="El password debe ser al menos de 5 caracteres"/>
                       <div class="error-div-login">
                            <h:message for="clave" styleClass="error"/>
                       </div>
                  </h:panelGroup>

              </h:panelGrid>
                <p>
        
                   </p>
                <p>
                    
                   
                </p>

                <p>
                    <h:commandButton type="submit" action="reset" id="Cancelar" styleClass="button" value="Cancelar" tabindex="4" />
                   <h:commandButton type="submit" action="#{loginController.validarUsuario()}" id="ingresar" styleClass="button" value=" Ingresar" tabindex="3" />
                </p>

              <p>&nbsp;</p>
         
<!-- //TODO: falta cuadrar el marco de mensajes de error -->
               
              </fieldset>
            </h:form>
          
          </div>
        </div>
        </div>
        <hr class="clear-contentunit" />  </div>

      <!-- B.3 SUBCONTENT -->
      <div class="main-subcontent">

        <!-- Subcontent unit -->
        <div class="subcontent-unit-border-orange">

          <div class="round-border-topleft"></div><div class="round-border-topright"></div>
         <h1 class="orange">Ayuda Login </h1>
          <p><strong>Usuario:</strong>Indique el nombre del usuario valido asignado a usted. (SOLO LETRAS). De no poseer un usuario registrado comuniquese con el administrador del Sistema. </p>
          <p><strong>Clave de Acceso :</strong> Indique el passworod de acceso al sistema.</p>
		   <p><strong>Ingresar:</strong> PResione el boton ingresar para Validar los datos e ingresar al sistema.</p>
		    <p><strong>Cancelar:</strong> Presione cancelar para limpiar el formulario.</p>


        </div>

        <!-- Subcontent unit -->


        <!-- Subcontent unit -->


        <!-- Subcontent unit -->
      </div>
    </div>

    <!-- C. FOOTER AREA -->

    <div class="footer">
      <p>Copyright &copy; 2010 Nogsoft Solutions C.A.| All Rights Reserved</p>
      <p class="credits">Original design by <a href="#" title="Designer Homepage">Freddy Nogales </a> | Thanks to <a href="http://www.google.co.ve" title="Nogsoft C.A.">Ingenieria Nogsoft C.A.</a> | Powered by <a href="#" title="Content Management System">Your CMS</a> | <a href="http://validator.w3.org/check?uri=referer" title="Validate XHTML code">W3C XHTML 1.0</a> | <a href="http://jigsaw.w3.org/css-validator/" title="Validate CSS code">W3C CSS 2.0</a></p>
    </div>
  </div>

</h:body>
</html>



